@charset "UTF-8";
@use 'sass:color';
@use './base';

$main-color: #3498db;
$main-color-light: color.adjust($main-color, $lightness: +2%);
$base-font-size: 16px;
$base-font-size: 20px !default; // 已经定义了，就使用定义的值
$primary-bg-color: #f0f0f0;

#app {
  width: 70vw;
  height: 100vh;
  margin: 0 auto;
  font-weight: normal;
  background-color: azure;
}

.button {
  display: inline-flex;
  justify-content: center;
  padding: 4px 6px;
  border-radius: 4px;
  font-size: 0.8rem;
  border: none;
  cursor: pointer;
  &--primary {
    background-color: $main-color;
    color: white;
    &:hover {
      background-color: color.adjust($main-color, $lightness: -10%);
    }
  }
  &--warning {
    background-color: orange;
    color: white;
    &:hover {
      background-color: color.adjust(orange, $lightness: -10%);
    }
  }
}
